<!DOCTYPE html>
<html>
  <head>
	<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
	<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
    <title></title>
  </head>
  <body bgcolor=white>

    <h2 style="color: white;">Data Lake</h2>
    <style>
  .border1 {
    border-style: solid;
    border-width: thin;
    padding: 20px;
    border: 1px LightGray;
    border-radius: 8px;
	background-color:LightGray;
  }
  </style>
    <div class="border1"><h2 class="heading" align="center">Quick Start Walk Through Guide</h2>
    <h6 align="center"> This wizard will guide you through a Data Lake reference architecture and Azure services used within.</h6>
    </div>
    <div><h4 class="subHeading">Step 2 : Discover RAW Datasets</h4>
    <div><h5 class="subHeading">Yash Data Lake leverage Azure Blob Storage and Azure DataFactory for data management and transformation of the data provided by the Customer.

Azure DataFactory is a fully managed extract, transform, and load (ETL) service.</h5>
        <br>
		<div align="center">
<button id="Get_dataset" class="btn btn-primary" align="center"> Discover raw datasets</button>
</div>
		<br>
        <form action=next_function_route method="post" align="center">
        <input id="name" name="name" type="hidden" value="create_transformed_datasets">
        <input type="submit" value="next"/>
        </form>
    </div>
	<script>
window.onload = function() {
	document.getElementById("Get_dataset").addEventListener("click", function(event){
		event.preventDefault();
        $.ajax({
            url: next_function_route,
            type: 'POST',
			crossOrigin: true,
			success: completeRequest,
			data: { 
				'name': 'get_dataset'
				},
            error: function ajaxError(jqXHR, textStatus, errorThrown) {
                console.error('Error requesting ride: ', textStatus, ', Details: ', errorThrown);
                console.error('Response: ', jqXHR.responseText);
                alert('An error occured when requesting your unicorn:\n' + jqXHR.responseText);
            }
        })
		console.log('Df started');
	});   
	
    function completeRequest(result) {
		var run_id = result;
		var status = 'InProgress';
		var myVar = setInterval(function(){
			console.log('Inside set interval method');
			$.ajax({
				url: next_function_route,
				type: 'POST',
				crossOrigin: true,
				data: { 
					'name': 'df_status',
					'run_id':run_id
					},
				 success: function(result2) {
					console.log('Status',result2)
					status=result2
					if (status != 'InProgress') {
						console.log('job completed');
						clearInterval(myVar);
					}
				}
			})}, 60000);
			
    }
}
</script>

  </body>
</html>